<template>
     <div class="top">
            <input type="text" placeholder="请输入要添加的事项" v-model="addValue"/>
            <div class="btn" @click="add">增加</div>
        </div>
</template>
<script>
export default {
    data(){
        return {
            addValue:'',
        }
    },

    methods:{
        add(){
            this.$emit('addThing',this.addValue)
            this.addValue = ''
        }
    }
}
</script>
<style scoped>
.top{
    width: 400px;
    overflow: hidden;
}
input{
    float: left;
    width: 300px;
    height: 26px;
}
.btn{
    float: right;
    width: 80px;
    height: 32px;
    line-height: 32px;
    background: skyblue;
    color: #fff;
    text-align: center;
}
</style>